<!DOCTYPE html>
<html lang="en" style="height:100%">

<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>我的申诉</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../../css/style.css" />
    <link rel="stylesheet" type="text/css" href="../../css/yzl.css" />
    <link rel="stylesheet" type="text/css" href="../../css/vant.css" />
    <!-- <link rel="stylesheet" href="../../css/sqc.css"> -->
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        input{
            outline:none;
        }
        .active{
            font-size: 15px;
            font-weight: bold;
        }
        .add_pic img{
          width: 30%;
        }
    </style>
</head>

<body style="background: #fff;">
<div id="blank" class="header" v-cloak>
    <div v-back.tapmode class="back"></div>
    <span class="title">我的申诉</span>
</div>
<div id="app" style="padding-top: 55px;"  v-cloak>
    <div class="problem-appeal">
        <div class="change-order-li" style="margin-bottom: 12px">
            <div class="stats-head">
                <div>
                    <div class="stats-head-zi">{{details_con.identityType== 1 ? hide_name_two(details_con.sellNickname) : hide_name_two(details_con.buyNickname)}}</div>
                    <div class="stats-head-name">{{details_con.identityType== 1 ? hide_name(details_con.sellNickname) : hide_name(details_con.buyNickname)}}</div>
                </div>
                <div class="stats-order-time">{{details_con.orderTradeTime}}</div>
            </div>
            <div class="order-info">
                <div style="margin-bottom: 15px">单价&nbsp;<span style="color: #333">{{details_con.tradePrice}} CNY</span></div>
                <div style="margin-bottom: 15px">总价&nbsp;<span style="color: #333">{{details_con.totalPrice}} CNY</span></div>
                <div>已冻结&nbsp;<span style="color: #333">{{details_con.tradeNum}} QHR</span></div>
            </div>
            <div class="appeal-details">
                <!-- <div class="appeal-details-bottom" v-open-win="{orderid:details_con.orderNo}" vurl="details">查看详情</div> -->
            </div>
        </div>
    </div>
    <div class="appeal-reason">
        <div class="appeal-reason-one">
            <div style="float: left">申诉原因&nbsp;&nbsp;</div><span class="app-neirong">{{content}}</span>
            <div class="choise"  v-show="content == ''">
                请选择
                <img style="width: 5px;height: 10px;" v-src="'../../image/arrow_right_grey.png'" />
            </div>
        </div>
        <div class="appeal-reason-one">
            <div style="float: left;width: 25%;">申诉补充&nbsp;</div>
            <input class="appeal-reason-one-ipt" style="list-style:none;" readonly=" readonly" v-modelo="supplement_content" type="text" placeholder="选填">
        </div>
        <div class="appeal-reason-one">
            <div style="float: left">上传图片</div>
        </div>
        <div class="add_pic" style="height:auto;border-bottom: 1px solid #f7f4f2;margin-bottom: 12px;">
          <div  class="upload-add" >
              <div class="upload-del" v-for="(list, index) in details_con_pic">
                <img class="upload-img"  :src="list"  >
              </div>
              <!-- <img v-myclick="show_pick" style="width: 29%;height:100px;display:inline-block;" v-show="filestr.length<3"  src="../../image/add_pricture.png"> -->
          </div>
        </div>
        <div class="pic-bottom">
            <div>1、申诉的问题将在1-2个工作日内完成处理</div>
            <div>2、举报内容一点要保证真实，如若发现恶意虚假举报，系统将会进行精确锁定，予以封号处理</div>
        </div>

        <div class="cover-appeal-info" v-show="details_con.appealResult == 1">
            <div style="display: flex;justify-content: center">
                <img class="cover-appeal-info-img" v-src="'../../image/cry_face.png'" />
            </div>
            <div class="cover-appeal-info-word">

                              经过我们的审核，您的申诉理由不成立，订单已
恢复正常。

            </div>
        </div>

        <div class="cover-appeal-info" v-show="details_con.appealResult == 2">
            <div style="display: flex;justify-content: center">
                <img class="cover-appeal-info-img" v-src="'../../image/sm_face.png'" />
            </div>
            <div class="cover-appeal-info-word">

                              您的申诉已处理，我们已对违规的用户进行了无
限期封停，一旦有不良用户，我们绝不姑息，给
您造成的影响表示歉意，感谢您的支持与理解。

            </div>
        </div>

    </div>
</div>
</body>
<script src="../../script/api.js"></script>
<script src="../../script/vue.js"></script>
<script src="../../script/app.js"></script>
<script src="../../script/common.js"></script>
<script src="../../script/url.js"></script>
<script src="../../script/components.js"></script>
<script type="text/javascript" src="../../script/jquery.js"></script>
<script type="text/javascript" src="../../script/vant.min.js"></script>

<script>
    var vm,
        details_list,
        details_con,
        details_con_pic,
    apiready = function () {
        setBSImg();
        new Vue({
            el: '#blank'
        })
        var details={
          "agtVer":1,
          "clientVer":1,
          "ctime":201911071802959,
          "cctime":201911071802959,
          "sign":"abcdefg",
          "token":getPrefs('token'),
          "pageNumber":1,
          "pageSize":10,
          "id":api.pageParam.id,
        }
        var base = new Base64();
        var	item=base.encode(JSON.stringify(details))
        var data = {
            jsonData:item,
        };
        var callback=function(ret){
            var base = new Base64();
            var details_list = base.decode(ret.content.jsonData);
            details_list =JSON.parse( details_list);
            // content_list=JSON.parse(data_list);
            details_con = details_list.appeal;
            details_con_pic = JSON.parse(details_con.pictureAds);
            console.log(JSON.stringify(details_con.pictureAds));
            initApp();
          }
          pinet.post(APIURLP+'/play/al/getInfoData',data, callback);
        api.parseTapmode();

    };

    function initApp() {
        // var isBigImg = Vue.BSImg == 'big';
        vm = new Vue({
            el: '#app',
            data: {
                show: false,
                actions: ['我收到虚假的付款凭证，且未收到付款' , '我付了款，但是未及时或忘记点已支付'],
                content:this.details_con.appealDescribe,
                addstatus:-1,
                title:'',
                supplement_content:this.details_con.appealReplenish,
                details_list:details_list,
                details_con:details_con,
                details_con_pic:details_con_pic,
            },
            computed: {
            },
            methods: {
              hide_name_two:function(name){
                return new Array(name.length).join('') + name.substr(-1);
              },
              hide_name:function(name){
                return new Array(name.length).join('*') + name.substr(-1);
              },
              onSelect(item) {
                  // 默认情况下，点击选项时不会自动关闭菜单
                  // 可以通过 close-on-click-action 属性开启自动关闭
                  this.show = true;
              },
              appealxuanze:function (index, event) {
                  this.addstatus = index;
                  this.title = this.actions[index];
              },
              addclick:function () {
                  this.show = false;
                  this.content = this.title;
              }
            },
            watch: {

            },
        })
    }

</script>

</html>
